<template>
    <view>
        <block name="xx_fen">
            <view class="apply_container" v-if="XxStatus == 0" :style="'min-height:' + XxGroupRes.length * 105 + 'rpx;background:' + color_two + ';'">
                <view class="apply_row b_all">
                    <text class="apply_check">*</text>
                    <view class="apply_name fl" :style="'color:' + color_one + ';'">姓名</view>
                    <view class="apply_value fl">
                        <input
                            @blur="bindXxNameInput"
                            name="name"
                            data-name="name"
                            :data-required="true"
                            placeholder="请输入姓名"
                            v-if="color_status == '1'"
                            :placeholder-style="'color:' + color_one + ';'"
                            type="text"
                            :value="onlineLicenseName"
                        />
                        <input
                            @blur="bindXxNameInput"
                            name="name"
                            data-name="name"
                            :data-required="true"
                            placeholder="请输入姓名"
                            v-else
                            placeholder-class="phcolor"
                            type="text"
                            :value="onlineLicenseName"
                        />
                    </view>
                </view>
                <view class="apply_row b_all" v-if="live.id == 4106 || live.id == 4102 || live.id == 4103 || live.id == 4104 || live.id == 4107">
                    <text class="apply_check">*</text>
                    <view class="apply_name fl" :style="'color:' + color_one + ';'">手机号</view>
                    <view class="apply_value fl">
                        <input
                            @blur="bindXxMobileInput"
                            name="mobile"
                            data-name="mobile"
                            :data-required="true"
                            placeholder="请输入手机号"
                            v-if="color_status == '1'"
                            :placeholder-style="'color:' + color_one + ';'"
                            type="number"
                            value=""
                        />
                        <input
                            @blur="bindXxMobileInput"
                            name="mobile"
                            data-name="mobile"
                            :data-required="true"
                            placeholder="请输入手机号"
                            v-else
                            placeholder-class="phcolor"
                            type="number"
                            value=""
                        />
                    </view>
                </view>
                <view class="apply_row b_all" v-if="live.id == 4439 || live.id == 4628 || live.id == 6227 || live.id == 5643">
                    <text class="apply_check">*</text>
                    <view class="apply_name fl" :style="'color:' + color_one + ';'">参赛证号</view>
                    <view class="apply_value fl">
                        <input
                            @blur="bindXxMobileInput"
                            name="mobile"
                            data-name="mobile"
                            :data-required="true"
                            placeholder="请输入参赛编号"
                            v-if="color_status == '1'"
                            :placeholder-style="'color:' + color_one + ';'"
                            type="text"
                            value=""
                        />
                        <input
                            @blur="bindXxMobileInput"
                            name="mobile"
                            data-name="mobile"
                            :data-required="true"
                            placeholder="请输入参赛编号"
                            v-else
                            placeholder-class="phcolor"
                            type="text"
                            value=""
                        />
                    </view>
                </view>
                <view class="apply_row b_all" v-if="live.id == 6905 || live.id == 5769 || live.id == 7002">
                    <text class="apply_check">*</text>
                    <view class="apply_name fl" :style="'color:' + color_one + ';'">身份证号</view>
                    <view class="apply_value fl">
                        <input
                            @blur="bindXxGroupsInput"
                            name="mobile"
                            data-name="mobile"
                            :data-required="true"
                            placeholder="请输入身份证号"
                            v-if="color_status == '1'"
                            :placeholder-style="'color:' + color_one + ';'"
                            type="text"
                            :value="XxGroups"
                        />
                        <input
                            @blur="bindXxGroupsInput"
                            name="mobile"
                            data-name="mobile"
                            :data-required="true"
                            placeholder="请输入身份证号"
                            v-else
                            placeholder-class="phcolor"
                            type="text"
                            :value="XxGroups"
                        />
                    </view>
                </view>
                <view class="apply_row b_all" v-if="live.id != 7747 && live.id != 7748 && live.id != 6227 && live.id != 7259 && live.id != 7260">
                    <text class="apply_check">*</text>
                    <view class="apply_name fl" :style="'color:' + color_one + ';'">{{ live.id == 5110 ? '参赛项目' : '组别' }}</view>
                    <view class="select-current" @tap.stop.prevent="openCloseXxGroups">
                        <text class="current-name" :style="'color:' + color_one + ';'">{{ XxGroups ? XxGroups : '请选择' }}</text>
                    </view>
                    <view class="option-list" v-if="isShowXxGroups">
                        <text
                            class="option"
                            @tap.stop.prevent="optionTapXxGroups"
                            :data-id="idx"
                            :data-name="select"
                            :style="'color:' + color_one + ';'"
                            v-for="(select, index) in XxGroupRes"
                            :key="select.idx"
                        >
                            {{ select }}
                        </text>
                    </view>
                </view>
                <view class="apply_btn_wrap">
                    <view @tap="XxSubmit" class="apply_submit_btn" :style="'background-color:' + color_one + ';'">立即查询</view>
                </view>

                <view :class="'page-dec ' + themes" v-if="is_xxfen_des" :style="'color:' + color_one + ';'">
                    <!-- <template is="wxParse" :data="wxParseData:WxParseListArr[tab_id]"></template> -->
                    <mp-html :content="WxParseListArr[tab_id]"></mp-html>
                </view>
            </view>
            <view class="info_div" v-if="XxStatus == 1">
                <view class="info" v-if="XxData[0].name">
                    <view class="heng_div">
                        <view class="left top">
                            <view class="topheng"></view>
                            查询结果
                        </view>
                        <view class="right top"></view>
                    </view>
                    <view class="heng_div" v-if="XxData[0].name">
                        <view class="left">姓名:</view>
                        <view class="right" style="">{{ XxData[0].name }}</view>
                    </view>
                    <block v-for="(item, index) in XxData" :key="index">
                        <view class="heng_div" v-if="item.groups">
                            <view class="left">{{ live.id == 5769 || live.id == 7002 ? '身份证号' : '组别' }}:</view>
                            <view class="right" style="">{{ item.groups }}</view>
                        </view>

                        <view class="heng_div" v-if="item.number">
                            <view class="left">参赛编号:</view>
                            <view class="right" style="">{{ item.number }}</view>
                        </view>

                        <view class="heng_div" v-if="item.rank">
                            <view class="left">排名:</view>
                            <view class="right" style="">{{ item.rank }}</view>
                        </view>

                        <view class="heng_div" v-if="item.fen">
                            <view class="left">分数:</view>
                            <view class="right" style="">{{ item.fen }}</view>
                        </view>

                        <view class="heng_div" v-if="item.win">
                            <view class="left">奖项:</view>
                            <view class="right" style="">{{ item.win }}</view>
                        </view>

                        <view class="heng_div" v-if="item.time">
                            <view class="left">{{ live.id == 5769 || live.id == 7002 ? '组别' : '参赛时间' }}:</view>
                            <view class="right" style="">{{ item.time }}</view>
                        </view>

                        <view class="heng_div" v-if="item.beizhu && (live.id == 4106 || live.id == 4102 || live.id == 4103 || live.id == 4104 || live.id == 4107)">
                            <view class="left">手机号:</view>
                            <view class="right" style="">{{ item.beizhu }}</view>
                        </view>

                        <view class="bottom_div" v-if="item.beizhu && (live.id != 4106 || live.id != 4102 || live.id != 4103 || live.id != 4104 || live.id != 4107)">
                            <view class="heng_div" style="border-bottom: 0">
                                <view class="left">备注:</view>
                            </view>
                            <view class="beizhu" style="">{{ item.beizhu }}</view>
                            <view style="width: 100%; height: 20rpx"></view>
                        </view>
                    </block>
                </view>
                <view class="info" v-else>
                    <view class="heng_div">
                        <view class="left top">
                            <view class="topheng"></view>
                            查询结果
                        </view>
                        <view class="right top"></view>
                    </view>
                    <view class="heng_div" v-if="XxData.name">
                        <view class="left">姓名:</view>
                        <view class="right" style="">{{ XxData.name }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.groups">
                        <view class="left">组别:</view>
                        <view class="right" style="">{{ XxData.groups }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.number">
                        <view class="left">参赛编号:</view>
                        <view class="right" style="">{{ XxData.number }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.rank">
                        <view class="left">排名:</view>
                        <view class="right" style="">{{ XxData.rank }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.fen">
                        <view class="left">分数:</view>
                        <view class="right" style="">{{ XxData.fen }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.win">
                        <view class="left">奖项:</view>
                        <view class="right" style="">{{ XxData.win }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.time">
                        <view class="left">参赛时间:</view>
                        <view class="right" style="">{{ XxData.time }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.beizhu && (live.id == 6227 || live.id == 5643)">
                        <view class="left">参赛证号:</view>
                        <view class="right" style="">{{ XxData.beizhu }}</view>
                    </view>
                    <view class="heng_div" v-if="XxData.beizhu && (live.id == 4106 || live.id == 4102 || live.id == 4103 || live.id == 4104 || live.id == 4107)">
                        <view class="left">手机号:</view>
                        <view class="right" style="">{{ XxData.beizhu }}</view>
                    </view>
                    <view class="bottom_div" v-if="XxData.beizhu && live.id != 6227 && live.id != 5643">
                        <view class="heng_div" style="border-bottom: 0">
                            <view class="left">备注:</view>
                        </view>
                        <view class="beizhu" style="">{{ XxData.beizhu }}</view>
                        <view style="width: 100%; height: 20rpx"></view>
                    </view>
                    <view class="bottom_div" style="text-align: center" v-if="live.id == 4106">
                        <image
                            mode="widthFix"
                            style="width: 25%"
                            @tap="photoLivePreview"
                            data-url="https://tovqb.top/ueditor/temp/2021/12/live_4106_code.jpg"
                            :show-menu-by-longpress="true"
                            src="https://tovqb.top/ueditor/temp/2021/12/live_4106_code.jpg"
                        ></image>
                    </view>
                </view>
            </view>
        </block>
    </view>
</template>

<script>
// wxz_wzbagent/pages/menu/xx_fen.js
export default {
    data() {
        return {
            XxStatus: 0,
            XxGroupRes: [],
            color_two: '',
            color_one: '',
            color_status: '',
            onlineLicenseName: '',

            live: {
                id: 0
            },

            XxGroups: [],
            isShowXxGroups: [],

            select: {
                idx: ''
            },

            themes: '',
            is_xxfen_des: [],
            name: '',
            XxData: []
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        bindXxNameInput() {
            console.log('占位：函数 bindXxNameInput 未声明');
        },

        bindXxMobileInput() {
            console.log('占位：函数 bindXxMobileInput 未声明');
        },

        bindXxGroupsInput() {
            console.log('占位：函数 bindXxGroupsInput 未声明');
        },

        openCloseXxGroups() {
            console.log('占位：函数 openCloseXxGroups 未声明');
        },

        optionTapXxGroups() {
            console.log('占位：函数 optionTapXxGroups 未声明');
        },

        XxSubmit() {
            console.log('占位：函数 XxSubmit 未声明');
        },

        photoLivePreview() {
            console.log('占位：函数 photoLivePreview 未声明');
        }
    }
};
</script>
<style>
@import './xx_fen.css';
</style>
